.CostHome {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;

	.Title {
		font-size: 20px;
		font-family: ShuHeiTi;
		font-weight: bold;
		color: #262626;
		padding: 0 8px;
	}

	& > .top {
		width: 100%;
		flex: 1;
		margin-bottom: 16px;
		display: flex;
		align-items: center;
		justify-content: center;

		& > div {
			height: 100%;
			background: white;
			border-radius: 8px;
			padding: 8px;
			display: flex;
			align-items: center;
			justify-content: center;
			flex-direction: column;

			&.left {
				flex: 2;
				margin-right: 16px;

				& > div {
					width: 100%;

					&.List {
						flex: 1;
						display: flex;
						align-items: center;
						justify-content: center;
						flex-wrap: wrap;

						& > div {
							width: 40%;
							display: flex;
							align-items: center;
							justify-content: flex-start;

							& > span {
								font-size: 40px;
								margin-right: 8px;
							}

							& > div {
								& > div:first-child {
									font-size: 16px;
									font-family: ShuHeiTi;
									font-weight: bold;
								}

								& > div:last-child {
									font-size: 24px;
									font-family: DIN Condensed;
									font-weight: bold;

									& > span {
										font-size: 16px;
										font-family: PingFang SC;
									}
								}
							}
						}
					}
				}
			}

			&.right {
				flex: 3;

				& > div {
					width: 100%;

					&.List {
						flex: 1;
					}
				}
			}
		}
	}

	& > .btm {
		width: 100%;
		flex: 1;
		background: white;
		border-radius: 8px;
		padding: 16px;
		position: relative;
		z-index: 1;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;

		& > .Title {
			width: 100%;
		}

		& > .List {
			width: 100%;
			flex: 1;
		}

		& > .Nav {
			position: absolute;
			right: 16px;
			top: 16px;
			height: 32px;
			display: flex;
			align-items: center;
			justify-content: center;

			& > .NavList {
				margin-right: 16px;
				position: relative;
				z-index: 1;
				height: 100%;
				display: flex;
				align-items: center;
				justify-content: center;
				position: relative;
				z-index: 1;

				& > .NavItem {
					width: 160px;
					height: 100%;
					display: flex;
					align-items: center;
					justify-content: center;
					cursor: pointer;
					user-select: none;
					font-size: 14px;
					font-family: ShuHeiTi;
				}

				& > .line {
					position: absolute;
					left: 0;
					bottom: 0;
					width: 80px;
					height: 4px;
					background: linear-gradient(45deg, #3372ff, #1de5e7);
					border-radius: 2px;
					transition: all 0.35s;
				}
			}
		}
	}
}
